///使用translate配合absolute实现不同方向居中
///@param {[string]} $dircetion [both] 默认实现水平垂直居中 [horizontal] 实现水平方向居中 [vertical] 实现垂直方向居中
///@link http://sassmeister.com/gist/5026ef13b60ea74431fd
@mixin center-translate($direction: both) {
    position: absolute;
    @if $direction == both {
        top: 50%;
        left: 50%;
        -webkit-transform: translate3d(-50%, -50%, 0);
        transform: translate3d(-50%, -50%, 0);
    }
    @else if $direction == horizontal {
        left: 50%;
        -webkit-transform: translate3d(-50%, 0, 0);
        transform: translate3d(-50%, 0, 0);
    }
    @else if $direction == vertical {
        top: 50%;
        -webkit-transform: translate3d(0, -50%, 0);
        transform: translate3d(0, -50%, 0);
    }
}
